<!DOCTYPE html>
<html lang="zh" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<th:block th:fragment="search-form">
    <!-- search start -->
    <form class="js-search search-form search-form--modal" method="get" action="/search" role="search">
        <img th:src="@{/theme/img/search.gif}">
        <div class="search-form__inner">
            <div>
                <p class="micro mb-">输入后按回车搜索 ...</p>
                <i class="iconfont icon-search"></i>
                <input class="text-input" type="search" name="keyword" placeholder="Search" required>
            </div>
        </div>
        <div class="search_close"></div>
    </form>
    <!-- search end -->
</th:block>
<th:block th:fragment="theme-change">
    <!-- theme-change start -->
    <div class="changeSkin-gear no-select">
        <div class="keys">
            <span id="open-skinMenu">切换主题 | SCHEME TOOL &nbsp;<i
                    class="iconfont icon-gear inline-block rotating"></i></span>
        </div>
    </div>
    <div class="skin-menu no-select">
        <div class="theme-controls row-container">
            <ul class="menu-list">
                <li id="bg_0" data-text="默认是纯洁的白色~">
                    <i class="fa fa-television" aria-hidden="true"></i>
                </li>
                <li id="bg_1" data-text="樱花飞舞~">
                    <i class="iconfont icon-sakura" aria-hidden="true"></i>
                </li>
                <li id="bg_2" data-text="格子控！">
                    <i class="fa fa-slack" aria-hidden="true"></i>
                </li>
                <li id="bg_3" data-text="小点点~">
                    <i class="iconfont icon-dots" aria-hidden="true"></i>
                </li>
                <li id="bg_4" data-text="充满力量的橙色">
                    <i class="fa fa-optin-monster" aria-hidden="true"></i>
                </li>
                <li id="bg_5" data-text="pixiv主题~">
                    <i class="iconfont icon-pixiv" aria-hidden="true"></i>
                </li>
                <li id="bg_6" data-text="必应图片">
                    <i class="iconfont icon-bing" aria-hidden="true"></i>
                </li>
                <li id="bg_7" data-text="关灯！">
                    <i class="fa fa-moon-o" aria-hidden="true"></i>
                </li>
            </ul>
        </div>
    </div>
    <!-- theme-change end -->
</th:block>

<th:block th:fragment="article-content(shareUrl,content,title)">
    <article>
        <div class="toc-container">
            <div class="toc"></div>
        </div>
        <div class="entry-content">
            [(${content})]
        </div><!-- .entry-content -->
        <footer class="post-footer">
            <div class="post-lincenses">
                <a href="http://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank"
                   rel="nofollow">
                    <i class="fa fa-creative-commons" aria-hidden="true"></i>
                    <span class="i18n" data-iname="post.creative_commons"></span>
                </a>
            </div>
            <div class="post-tags">
            </div>
            <link rel='stylesheet' th:href='@{/theme/css/share.css}' type='text/css'>
            <div class="post-share">
                <ul class="social-share sharehidden">
                    <li>
                        <a th:href="|http://service.weibo.com/share/share.php?url=${shareUrl}&appkey=&title=${title}|"
                           onclick="window.open(this.href, 'weibo-share', 'width=490,height=700');return false;"
                           class="s-weibo i18n" data-iname="share.weibo" data-iattr="title">
                            <img src="//cdn.jsdelivr.net/gh/LIlGG/halo-theme-sakura@1.3.1/source/images/sns/weibo.png"/>
                        </a>
                    </li>
                    <li>
                        <a th:href="|http://connect.qq.com/widget/shareqq/index.html?url=${shareUrl}|"
                           onclick="window.open(this.href, 'qq-share', 'width=730,height=500');return false;"
                           class="s-qq i18n" data-iname="share.qq" data-iattr="title">
                            <img src="//cdn.jsdelivr.net/gh/LIlGG/halo-theme-sakura@1.3.1/source/images/sns/qq.png"/>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:" class="s-wechat">
                            <div class="wechat-qrcode">
                                <h4 class="i18n" data-iname="share.wechat.qcode_title"></h4>
                                <div id="qrcode" class="qrcode" th:title="${title}"
                                     th:data-url="${shareUrl}"></div>
                                <div class="help">
                                    <p class="i18n" data-iname="share.wechat.help_1"></p>
                                    <p class="i18n" data-iname="share.wechat.help_2"></p>
                                </div>
                            </div>
                            <img src="//cdn.jsdelivr.net/gh/LIlGG/halo-theme-sakura@1.3.1/source/images/sns/wechat.png"/>
                        </a>
                    </li>
                    <li>
                        <a th:href="|http://shuo.douban.com/!service/share?href=${shareUrl}|"
                           onclick="window.open(this.href, 'douban-share', 'width=490,height=600');return false;"
                           class="s-douban i18n" data-iname="share.douban" data-iattr="title">
                            <img src="//cdn.jsdelivr.net/gh/LIlGG/halo-theme-sakura@1.3.1/source/images/sns/douban.png"/>
                        </a>
                    </li>
                    <li>
                        <a th:href="|http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=${shareUrl}|"
                           onclick="window.open(this.href, 'qzone-share', 'width=490,height=600');return false;"
                           class="s-qzone i18n" data-iname="share.qzone" data-iattr="title">
                            <img src="//cdn.jsdelivr.net/gh/LIlGG/halo-theme-sakura@1.3.1/source/images/sns/qzone.png"/>
                        </a>
                    </li>
                </ul>
                <i class="iconfont show-share icon-forward"></i>
            </div>
        </footer><!-- .entry-footer -->
    </article><!-- #post-## -->
</th:block>
<th:block th:fragment="next-article(img,url,title)">
    <section class="post-squares nextprev">
        <div class="post-nepre full next">
            <a th:href="${url}" rel="next">
                <div class="background" th:style="|background-image:url(${img})|">
                </div>
                <span class="label i18n" data-iname="post.next"></span>
                <div class="info">
                    <h3>[[${title}]]</h3>
                    <hr>
                </div>
            </a>
        </div>
    </section>
</th:block>
<th:block th:fragment="author-profile(img,name,url)">
    <section class="author-profile">
        <div class="info" itemprop="author" itemscope="" itemtype="http://schema.org/Person">
            <a th:href="${url}" class="profile gravatar">
                <img th:src="${img}" itemprop="image" th:alt="${name}" height="70" width="70">
            </a>
            <div class="meta">
                <span class="title">[[${name}]]</span>
                <h3 itemprop="name">
                    <a th:href="${url}" itemprop="url" rel="author">[[${name}]]</a>
                </h3>
            </div>
        </div>
        <hr>
        <p><i class="iconfont icon-pencil"></i>
            <span class="i18n" data-iname="user.description"></span>
        </p>
    </section>
</th:block>




<th:block th:fragment="foot(name,year)">
    <footer id="colophon" class="site-footer" role="contentinfo">
        <div class="site-info">
            <div class="footertext">
                <p class="foo-logo"
                   style="background-image:url('http://cdn.jsdelivr.net/gh/LIlGG/cdn@1.0.8/img/Sakura/images/sakura.svg');">
                </p>
            </div>
            <div class="footer-device">
                <p style="font-family: 'Ubuntu', sans-serif;">
                        <span>Powered
                            <i class="fa fa-vimeo animated" style="color: #e74c3c;"></i>
                            by
                            <a rel="me" target="_blank" href="http://halo.run" title="一个优秀的开源博客发布应用"
                               style="text-decoration:none;">Halo</a>
                        </span>
                    •
                    <span>Crafted with
                            <i class="fa fa-heart animated" style="color: #e74c3c;"></i>
                            by
                            <a rel="me" target="_blank" href="http://github.com/LIlGG/halo-theme-sakura"
                               style="text-decoration:none;">LIlGG</a>
                        </span>
                </p>
                <p>
                    © [[${year}]] [[${name}]]
                </p>
            </div>
        </div><!-- .site-info -->
    </footer>
</th:block>


</body>
</html>